<%-- internal/view/report/index.jsp --%>

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<%@page import="java.util.*" %>
<%@page import="problemDomain.EmployeeAccountBean"%>
<%@page import="problemDomain.EmployeeAccountBean.Position"%>

<%
	//get the currently logged on employee from session
	EmployeeAccountBean employee = (EmployeeAccountBean)session.getAttribute("employee");
	EmployeeAccountBean.Position pos = null;
	if (employee != null)
		pos = employee.getPosition();
	else {
		response.sendRedirect("../../login/");
		return;
	}
	if (pos != Position.MANAGER) {
		response.sendRedirect("../../login/");
		return;
	}
%>

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
		<link type="text/css" rel="stylesheet" href="../../css/general.css" />
		<link type="text/css" rel="stylesheet" href="../../css/framed.css" />
		<link type="text/css" rel="stylesheet" href="../../css/report/form.css" />
		<script type="text/javascript" src="../../js/ajax-handler.js"></script>
		<script type="text/javascript" src="../../js/form.js"></script>
		<script type="text/javascript" src="../../js/dialog.js"></script>
		<script type="text/javascript" src="../../js/report/maintain.js"></script>
		<script type="text/javascript" src="../../js/report/form.js"></script>
		<script type="text/javascript" src="../../js/report/view.js"></script>
		
		<!-- Author:  Bazillyo - bazillyo@yahoo.com - http://www.geocities.com/bazillyo/spiffy/calendar/ -->
		<link rel="stylesheet" type="text/css" href="spiffy/spiffyCal.css" />
		<script type="text/javascript" src="spiffy/spiffyCal.js"></script>
		<script type="text/javascript">
		   var cal3 = new ctlSpiffyCalendarBox('cal3', 'salesPerTimePeriodReportForm', 'fromDate2', 'btnDate1', '', 2);
		   var cal4 = new ctlSpiffyCalendarBox('cal4', 'salesPerTimePeriodReportForm', 'toDate2', 'btnDate1', '', 2);
		   var cal5 = new ctlSpiffyCalendarBox('cal5', 'rptForm', 'fromDate3', 'btnDate1', '', 2);
		   var cal6 = new ctlSpiffyCalendarBox('cal6', 'rptForm2', 'toDate3', 'btnDate2', '', 2);
		</script>
		
		<title>ORDRS - View Reports</title>
	</head>
		
	<body onLoad="loadPage();">
		<div id="spiffycalendar" class="text"></div>
		<div id="wholePanel">
			<!-- Title -->
			
			<div class="pageTitle">
				View Reports
			</div>
			
			<!-- END Title -->
			
			<!-- Navigation Panel -->
			<div class="navi">
				<table class="navi" align="right">
					<tr>
					<%
					
					// Display the links according to the employee's position
					if (pos != null){
						out.println("<td class=\"navi\"><a href=\"../../maintain/delivery/\">Delivery</a></td>");
						out.println("<td class=\"navi\"><a href=\"../../maintain/order/\">Order</a></td>");
						
						if (pos == EmployeeAccountBean.Position.MANAGER) {
							out.println("<td class=\"navi\"><a href=\"../../maintain/food-item/\">Food Item</a></td>");
							out.println("<td class=\"navi\"><a href=\"../../maintain/menu/\">Menu</a></td>");
							out.println("<td class=\"navi\"><a href=\"../../maintain/menu-item/\">Menu Item</a></td>");
							out.println("<td class=\"navi\"><a href=\"../../maintain/employee/\">Employee</a></td>");
							out.println("<td class=\"navi\"><a href=\"../../maintain/reservation/\">Reservation</a></td>");
						}
					}
					
					%>
						<td class="navi"><a href="../../login/">Logout</a></td>
					</tr>
				</table>
			</div>
			<!-- END Navigation Panel -->
			
			
			<!-- Panel -->
			<div class="panel">
				<table style="border-collapse: collapse" align="center" >
					<tr><td colspan="4"><hr /></td></tr>
					<tr style="height: 30px">
						<td rowspan="2">
							<!-- Fields -->
							<div id="menuTabs">
								<a class="tab activeTab" href="#" onClick="changeMenuView(this, 'report1');">Profitability vs. Popularity</a>
								<a class="tab" href="#" onClick="changeMenuView(this, 'report2');">Sales per Time Period</a>
								<a class="tab" href="#" onClick="changeMenuView(this, 'report3');">Cost Profit by Menu Item</a>
							</div>
				
							<div id="report1">
								<h1>Profitability vs. Popularity Report</h1>
								<form name="frmTest" action="../ReportProfitabilityPopularity" method="post">
									From: <script type="text/javascript">cal1.writeControl();</script><br/>
									To: <script type="text/javascript">cal2.writeControl();</script><br/>
									<input value="Report" type="submit" />
								</form>
							</div>
							<div id="report2">
								<h1>Sales per Time Period Report</h1>
								<form name="salesPerTimePeriodReportForm" id="salesPerTimePeriodReportForm">
								<h3>Date Range</h3>
									From: <script type="text/javascript">cal3.writeControl();</script>
									 To: <script type="text/javascript">cal4.writeControl();</script><br />
								<h3>Time Period</h3>
									<input type="radio" name="timePeriod" value="Hour" checked />Hour 
									<input type="radio" name="timePeriod" value="Day" />Day 
									<input type="radio" name="timePeriod" value="Week" />Week 
									<input type="radio" name="timePeriod" value="Month" />Month 
									<input type="radio" name="timePeriod" value="Year" />Year
									<input type="radio" name="timePeriod" value="Date" />Date
									<ul class="toolbar">
										<li onclick="buildSalesPerTimePeriodReport()">Report</li>
									</ul> 
								</form>
							</div>
							<div id="report3">
								<h1>Cost Profit by Menu Item Report</h1>
								<table>
									<tr>
									<td colspan="2"><h4>Set the time span</h4></td>
									</tr>
									<tr>
									<td class="fieldLabel">From:</td>
									<td>
									<form name="rptForm"><script type="text/javascript">cal5.writeControl();</script></form>
									</td>
									</tr>
									<tr>
									<td class="fieldLabel">To:</td>
									<td>
									<form name="rptForm2"><script type="text/javascript">cal6.writeControl();</script></form>
									</td>
									</tr>
								</table>
								<ul class="toolbar">
									<li onclick="generateCostProfitReport()">Report</li>
								</ul>
							</div>
						</td>
						
					<td rowspan="3" class="vrule" ></td>
					<td align="center" colspan="2">
						
						</td>
					</tr>
					<tr>
							<!-- END Fields -->
						<td class="resultsHead" >Results</td>
						<td>
							<!-- Results -->
							<div id="results" class="resultsPanel">
							</div>
							
							<!-- END Results -->
						</td>
						<td>
							<ul class="toolbar">
								<li onclick="printReport();">Print</li>
							</ul> 
						</td>
					</tr>
					<tr>
						<td>
						
						</td>
						<td class="resultsTD"  colspan="2">
							
						</td>
					</tr>
				</table>
			</div>
			<!-- END Panel -->
		</div>
	</body>
</html>
